// tab js
define(['/src/js/libs/swiper.min', 'backbone'], function(Swiper, Backbone) {
	var UITab = Backbone.View.extend({
		el: '.com-tab',
		initialize: function(opts) {
			var opts = opts || {};
			opts.el && this.setElement(opts.el);
			this.renderEls();
			this.initTabSwiper();
		},
		events: {
			'click [data-key]:not(.is-cur)': 'evt_toggleBars'
		},
		renderEls: function() {
			this.els = {
				swiperContainer: this.$('.com-tab-container'),
				bar: this.$('.com-tab-bar a'),
				content: this.$('.com-tab-content')
			}
		},
		initTabSwiper: function() {
			this.tabSwiper = new Swiper(this.els.swiperContainer, {
				onSlideChangeEnd: _.bind(this.evt_slideChanged, this)
			});
		},
		evt_slideChanged: function(swiper) {
			var curIdx = swiper.activeIndex;
			this.els.bar.removeClass('is-cur');
			this.els.bar.eq(curIdx).addClass('is-cur');
		},
		evt_toggleBars: function(e) {
			var $target = $(e.currentTarget);
			var curIdx = $target.index();
			if (this.tabSwiper && curIdx >= 0) {
				this.els.bar.removeClass('is-cur');
				$(e.currentTarget).addClass('is-cur');
				this.tabSwiper.slideTo(curIdx);
			}
		}
	});
	return UITab;
});